<template> 
	<view class=" bg-white quan-card m-4 relative   ">
		<view class="left  h-[100%] flex  ">
			<view class="left-a  w-[20%]  items-center flex justify-center ">
				<view class="fs-24 ml-2 weight-700  items-center flex  ">
					￥
				</view>
				<view class="fs-24 weight-700  items-center flex">
					{{item.denomination}}
				</view>
			</view>
			<view class="right-a   w-[50%]  items-center flex   ">
				<view>
					<view class="text mr-[30px] ml-[10px]"> 
						<text v-if="item.grantType === 0">注册券</text>
					    <text  v-else>平台券</text>
					</view>
					<view class="time mr-[20px] ml-[10px]">
						{{item.expireDate}}
					</view>
				</view>
			</view>
		</view>
		<view class=" h-full bg-[#d76162] absolute top-0 right-0 w-[120px]  h-[90px] flex   items-center">
				<view class="bb"></view>
			<view class="  weight-700 aa ml-[25px]"> 集运券 </view>
		</view>
	</view>

</template>

<script>
	export default {
		name: "quan-card",
		props: {
			item: {
				type: Object,
				default: {}
			}
		}
	}
</script>

<style lang="scss">
	.aa {
		font-size: 16px;
		line-height: 56px;
		text-align: center;
		width: 56px;
		/* 设置宽度 */
		height: 56px;
		border-radius: 50%;
		/* 将边角设置为50%，即变成圆形 */
		background: linear-gradient(to bottom, #f8efb5, #f4d99c);
	}
	.bb {
		width: 25px;
		height: 50px;
		border-radius: 0 25px 25px 0;
		/* 将边角设置为50%，即变成圆形 */
		background: linear-gradient(to bottom, #f8efb5, #f4d99c);
	}
	.weight-700 {

		font-weight: 700;
	}

	.fs-24 {
		font-size: 24px;
	}

	.right-a {
		border-left: 2px dashed red;

		margin-right: 32px;
		margin-left: 10px;
	}

	.quan-card {

		color: #e66368;
		height: 90px;

		.left {

			background: linear-gradient(to bottom, #faf5bc, #f2d294);
			border-top: 4px solid #fff;
			border-bottom: 4px solid #fff;
			border-left: 4px solid #fff;

			.text {
				font-size: 14px;
			}

			.time {
				font-size: 12px;
			}

		}

		

		


	}
</style>